<template>
    <div v-if="showPage">
      <div>
        <p class="issue-title">全部内容（{{ totalCount }}）</p>
        <div>
          <comment :Posts="posts" :delBtn="true" :needStatus="true" @delPosts="delPosts"></comment>
        </div>
      </div>
      <bottoms info="暂无发帖信息" tips="去发个帖试试吧～"></bottoms>
    </div>
</template>

<script>
  import comment from "@/components/comment/index"
  import bottoms from '@/components/reachBottom/index'
    export default {
      name: "issue",
      components: {
        comment,
        bottoms
      },
      data() {
        return {
          posts: [], //影视学堂列表
          loadingEnd: {
            moduleOne: false,
          },
          showPage: true,
          totalPage: 1,
          currentPage: 1,
          totalCount: 0
        }
      },
      methods:{
        delPosts(id){
          let num = this.posts.findIndex((item) => {
            return (parseInt(item.id) === parseInt(id))
          })
          this.posts.splice(num,1)
          this.totalCount --
          if(this.posts.length === 0){
            this.viewLoad()
          }
        },
        getList(){
          this.$ajax
            .post(this.$api.myPosts,{page: this.currentPage})
            .then(res => {
              this.posts.push(...res.data);
              this.loadingEnd.moduleOne = true
              this.totalPage = res.total_page
              this.totalCount = res.total_count
              if(res.total_count === 0){
                this.$store.dispatch("changeIsEmpty", true);
              } else {
                this.$store.dispatch("changeIsEmpty", false);
              }
            })
            .catch(err => {
              this.loadingEnd.moduleOne = true
              ﻿uni.showToast({
                title: err,
                icon: 'none',
                duration: 2000
              })
            });
        },
        viewLoad(){
          this.$store.dispatch("changeIsMore", false);
          this.$store.dispatch("changeIsEnd", false);
          this.$store.dispatch("changeIsEmpty", false);
          this.currentPage = 1
          this.posts = []
          this.loadingEnd = {
            moduleOne: false,
          };
          ﻿uni.showLoading({
            title: '加载中',
            mask: true
          });
          this.getList();
        },
      },
      computed:{
        hideLoading(){
          if(this.loadingEnd.moduleOne){
            setTimeout(function(){
              ﻿uni.hideLoading()
            }, 800)
          }
        }
      },
      onReachBottom(){
        if(this.totalPage > this.currentPage){
          this.$store.dispatch("changeIsMore", true);
          this.$store.dispatch("changeIsEnd", false);
          this.currentPage++
          this.getList();
        } else {
          this.$store.dispatch("changeIsEnd", true);
          this.$store.dispatch("changeIsMore", false);
        }
      },
      onPullDownRefresh(){
        this.viewLoad()
        ﻿uni.stopPullDownRefresh() //停止下拉刷新
      },
      onHide(){
        this.showPage= false;
      },
      onShow(){
        this.showPage= true;
        this.viewLoad();
      }
    }
</script>

<style scoped>
.issue-title{
  font-size: 22rpx;
  color: #A7A6AE;
  font-weight: bold;
  width: 100%;
  padding: 18rpx 30rpx;
  background-color: #F6F6F8;
  box-sizing: border-box;
}
  .issue-title+div{
    padding-bottom: 30rpx;
    box-sizing: border-box;
  }
</style>
